<template>
	<view>
		<cu-custom bgColor="bg-blue" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">申请加分</block>
		</cu-custom>
		<van-cell-group>
			<van-field :value="inputForm.name" required label="姓名" readonly= true placeholder="请输入姓名" />
			<van-field :value="inputForm.institute" required label="学院" readonly= true placeholder="请输入学院"  />
			<van-field :value="inputForm.grade" required label="年级" readonly= true placeholder="请输入年级"  />
			<van-field :value="inputForm.classe" required label="班级" readonly= true placeholder="请输入班级"  />
			<van-field :value="inputForm.num" required label="学号" readonly= true placeholder="请输入学号" />
			<van-cell title="加分原因" required is-link :value="inputForm.reason" @click="showPopup()" />
			<van-popup :show="isShow" position="bottom">
				<van-picker :columns="columns" show-toolbar @cancel="onCancel" @confirm="onConfirm"/>
			</van-popup>
			<van-field :value="inputForm.point" required label="加分数" id="point" placeholder="请输入加分数" @change="OnChange" />
			<van-uploader :file-list="fileList" upload-text="附件" @after-read="afterRead" />
		</van-cell-group>
		<van-dialog id="van-dialog" />
		<button class="cu-btn block bg-blue margin-tb-sm lg" type="" @click="submit()" :disabled = "isWrite">提交</button>
	</view>
</template>

<script>
	import { mapState } from 'vuex'
	import Dialog from '../../wxcomponents/vant/dist/dialog/dialog'
	export default {
		data() {
			return {
				isShow: false,
				columns: [],
				isWrite: false,
				inputForm: {
					name:'',		// 姓名
					institute:'',	// 学院
					grade:'',		// 年级
					classe:'',		// 班级
					num:'',	// 学号
					reason:'',	// 加分原因
					point:'',	// 加分数
					fileUrlList: [] ,// 附件Url
				},
				fileList: [] ,// 附件数组
				flag: false //判断是否可以提交
			}
		},
		computed: mapState({
			 userInfo: (state) => state.user.userInfo
		  }),  
		  onLoad() {
		  	this.onGetDictList()
		  },
		methods: {
			// 获取字典
			onGetDictList () {
				for(var i in this.$dictUtils.getDictList('evaluation_reason')) {
					this.columns.push(this.$dictUtils.getDictList('evaluation_reason')[i].label)
				}
			},
			onConfirm (event) {
				// console.log(event)
				const { picker, value, index } = event.detail
				// console.log(`当前值：${value}, 当前索引：${index}`)
				this.inputForm.reason = value
				this.isShow = false
			},
			onCancel () {
				this.isShow = false
			},
			// 是否展示弹出层
			showPopup () {
				this.isShow = true
			},
			// 附件
			async afterRead(event) {
				const { file }  = event.detail
				let uploadFileData = await this.$http.upload('/sys/file/webupload/upload?uploadPath=/moredumain/studentMoreduMain',file.url, 'file', {}, {})
				this.inputForm.fileUrlList.push(JSON.parse(uploadFileData).url)
				this.fileList.push({...file, url: file.url})
			  },
			onShow(){
				this.pullUser()
			  },
			pullUser(){
				this.inputForm.name = this.userInfo.name
				this.inputForm.institute = this.userInfo.office.name
				this.inputForm.grade = this.userInfo.grade
				this.inputForm.classe = this.userInfo.classn
				this.inputForm.num = this.userInfo.no
			},
			//表单提交
			submit() {
				let urlList = this.inputForm.fileUrlList.toString()
				// 如果检查不成功直接跳出方法
				if (this.check() == false){
					return
				}
				this.isWrite = true
				if(this.flag) {
					this.$set(this.inputForm, 'name', this.inputForm.name) // 姓名
					this.$set(this.inputForm, 'institute', this.inputForm.institute) // 学院
					this.$set(this.inputForm, 'grade', this.inputForm.grade) // 年级
					this.$set(this.inputForm, 'classe', this.inputForm.classe) // 班级
					this.$set(this.inputForm, 'num', this.inputForm.num) // 学号
					this.$set(this.inputForm, 'reason', this.inputForm.reason) // 加分原因
					this.$set(this.inputForm, 'point', this.inputForm.point) // 加分数
					this.$set(this.inputForm, 'fileUrl', urlList) // 加分数
					this.$http.get('/commit/studentSubmit/addpoint',this.inputForm).then(({data})=>{
						if (data.success) {
							Dialog.alert({
							  message: '提交成功!',
							}).then(() => {
							this.isWrite = false
							  uni.navigateTo({
							  	url: '/pages/index/index'
							  })
							})
						} else {
							uni.showToast({
								icon:"none",
								title:"提交失败！"
							})
						}
					})
				}
			},
			OnChange(event) {
				let type = event.currentTarget.id
				this.inputForm[type] = event.detail
			},
			// 数据验证
			check () {
				var number = /^[0-9]+.?[0-9]*/ // 验证字符串是否为数字
				if (this.inputForm.reason === '') {
					uni.showToast({
						title: "请输入加分原因!",
						icon: 'none'
					})
					return false
				} else if (this.inputForm.point === '' || !number.test(this.inputForm.point)) {
					uni.showToast({
						title: "未输入加分数或加分数输入有误!",
						icon: 'none'
					})
					return false
				} else if (this.inputForm.fileList === []) {
					uni.showToast({
						title: "请提交附件!",
						icon: 'none'
					})
					return false
				} else {
					this.flag = true
				}
			}
		}
	}
</script>